<template>
  <div>
    <!-- 已派单详细 2018/3/7 11:44 zhangQ -->
    <Table :columns="expandColumns" :data="rows"></Table>
    <xlinkModal v-model="operatModal.viewTackOutDetailList" title="查看详情" width="1200">
      <viewTackOutDetail v-if="operatModal.viewTackOutDetailList"
        :params="viewTackOutDetailListParams"></viewTackOutDetail>
    </xlinkModal>
    <Modal
      v-model="takeOutContainerShow"
      title="填写掏箱个数">
      <Row>
        <label style="width: 80px">
          掏箱个数
        </label>
        <i-input style="width: 300px" type="text" v-model="takeOutContainerNum" placeholder="输入件数">
        </i-input>
        <Button type="info" @click="confrimAddData">确定</Button>
        <Button type="primary" @click="takeOutContainerShow = false">取消</Button>
      </Row>
      <div slot="footer">
      </div>
    </Modal>
  </div>
</template>

<script>
  import {assignmentToDriverRemove, completTakeOutConByFleetId, fleetBindDriverOrder, getContainerNoFromDrivers} from '@api/backEnd/fleetOrder'
  import {getTrainTypeCN} from './trainTypeEnum'
  import {mapGetters} from 'vuex'
  import xlinkModal from '@components/modal/xlinkModal'
  import viewTackOutDetail from './viewTackOutDetail'

  export default {
    name: 'dispatch-complete-expand',
    data () {
      let expandColumns = [
        {
          type: 'index',
          width: 60
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: 200,
          fixed: 'left',
          render: (h, params) => {
            // let removeBtn = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.handleTakeOutList(params.row)}>掏箱记录</i-button>)
            let removeBtn1 = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.confrimQueryData(params.row)}>掏箱完成</i-button>)
            let removeBtn2 = (<i-button type="error" size="small" style="margin-right: 5px;" onClick={() => this.remove(params.row)}>撤销</i-button>)
            let btnArray = []
            if (params.row.takeOutContainerState === 1) {
              // btnArray.push(removeBtn)
              btnArray.push(removeBtn1)
            }
            if (params.row.takeOutContainerState === 0) {
              btnArray.push(<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.bindOrderAction(params.row)}>司机绑单</i-button>)
            }
            btnArray.push(removeBtn2)
            // btnArray.push(removeBtn)
            return (btnArray)
          }
        },
        {
          title: '掏箱',
          ellipsis: 'false',
          width: 100,
          render: (h, params) => {
            let state = '非掏箱'
            // console.log(params.row.takeOutContainerState)
            if (params.row.takeOutContainerState === 1) {
              state = '掏箱'
            }
            return (<span>{state}</span>)
          }
        },
        {
          title: '火车车种类型',
          ellipsis: 'false',
          width: 150,
          render: (h, params) => {
            let trainType = params.row.trainType
            let trainTypeCN = getTrainTypeCN(trainType)
            return (<span>{trainTypeCN}</span>)
          }
        },
        {
          title: '箱号',
          ellipsis: 'false',
          width: 150,
          key: 'containerNoBody',
          render: (h, params) => {
            let containerNo = params.row.containerHead + params.row.containerBody
            // console.log(containerNo)
            return (<span>{containerNo ? containerNo : ''}</span>)
          }
        },
        {
          title: '送货地址',
          ellipsis: 'false',
          width: 200,
          key: 'outAddress'
        },
        {
          title: '联系人',
          ellipsis: 'false',
          width: 100,
          key: 'outContacts'
        },
        {
          title: '联系人电话',
          ellipsis: 'false',
          width: 150,
          key: 'outMobile'
        },
        {
          title: '发货人',
          ellipsis: 'false',
          key: 'receiver',
          width: 250
        },
        {
          title: '收货人',
          ellipsis: 'false',
          key: 'shipper',
          width: 250
        },
        {
          title: '品名',
          ellipsis: 'false',
          key: 'pm',
          width: 150
        },
        {
          title: '接取费(元)',
          ellipsis: 'false',
          key: 'receiveFee',
          width: 120
        },
        {
          title: '送达费(元)',
          ellipsis: 'false',
          key: 'deliverFee',
          width: 120
        }
      ]
      let operatModal = {
        viewTackOutDetailList: false
      }
      let selectionSubOrder = []
      let currentRow = []
      let viewTackOutDetailListParams = {}
      let currentSendObj = {containerNo: '', driverId: ''}
      let takeOutContainerShow = false
      let takeOutContainerNum = 0
      let dribverParam = {}
      let datas = {operatModal, expandColumns, selectionSubOrder, currentRow, viewTackOutDetailListParams, currentSendObj, takeOutContainerShow, takeOutContainerNum, dribverParam}
      return datas
    },
    props: {
      rows: {
        type: Array,
        default () {
          return []
        }
      },
      currentRowOneLine: {
        type: Object,
        default () {
          return {}
        }
      },
      rowsAll: {
        type: Object,
        default () {
          return {}
        }
      }
    },
    computed: {
      ...mapGetters(['currentToken', 'currentUser'])
    },
    methods: {
      bindOrderAction (row) {
        let containerNo = row.containerHead + row.containerBody
        this.currentSendObj.containerNo = containerNo
        let drivers = []
        getContainerNoFromDrivers({containerNo}).then(res => {
          if (+res.data.isSuccess === 1) {
            drivers = res.data.data
            return Promise.resolve(drivers)
          }
        }).then(res => {
          this.$Modal.confirm({
            render: (h) => {
              let options = []
              drivers.forEach(item => {
                options.push(<i-option value={item.driverId}>{item.driverName}</i-option>)
              })
              return (<i-select v-model={this.currentSendObj.driverId}>
                {options}
              </i-select>)
            },
            onOk: () => {
              this.startBindDriverOrder()
            }
          })
        })
      },
      startBindDriverOrder () {
        let sendObj = {
          driverId: this.currentSendObj.driverId,
          containerNo: this.currentSendObj.containerNo,
          voucherImg: '[]'
        }
        fleetBindDriverOrder(sendObj).then(res => {
          if (+res.data.isSuccess === 1) {
            this.$Notice.success({
              title: '操作成功'
            })
            this.$emit('reloadData')
          }
        })
      },
      remove (rows) {
        console.log(rows)
        let param = [{groupNo: rows.sendDriverGroupNo, id: rows.id}]
        assignmentToDriverRemove(param).then(res => {
          if (+res.data.isSuccess === 1) {
            this.$Message.success('撤销成功')
            this.$emit('reloadData')
          } else {
            this.$Message.success(res.data.res)
          }
        })
      },
      handleTakeOutList (rows) {
        // 获取子运单
        // console.log(rows.subOrderId)
        // 获取车队号
        let fleetId = this.currentUser.userId
        console.log(fleetId)
        this.viewTackOutDetailListParams.id = rows.subOrderId
        this.viewTackOutDetailListParams.fleetId = fleetId
        this.operatModal.viewTackOutDetailList = true
      },
      handleTakeOutComplete (rows) {
        console.log('takeOutContainerNum', this.takeOutContainerNum)
        let param = {
          subOrderId: rows.subOrderId,
          fleetOrderId: rows.fleetOrderId,
          takeOutContainerNum: this.takeOutContainerNum
        }
        // console.log(param)
        completTakeOutConByFleetId(param).then(res => {
          if (res.data.isSuccess === 1) {
            this.$Message.success('已完成')
            this.$emit('reloadData')
          } else {
            this.$Message.success(res.data.res)
          }
        })
      },
      confrimAddData () {
        this.handleTakeOutComplete(this.dribverParam)
        this.takeOutContainerShow = false
      },
      confrimQueryData (value) {
        this.takeOutContainerShow = true
        this.dribverParam = value
      }
    },
    created () {
    },
    mounted () {
      // console.log('-----------expand========')
      // console.log(this.rows)
      // console.log(this.rowsAll)
    },
    /* watch: {
     currentRowOneLine: {
     handler: function (val, oldVal) {
     console.log(this.currentRowOneLine)
     if (this.currentRowOneLine.checkVal === 'All') {
     console.log(this.rows)
     this.subOrderCheck(this.rows)
     }
     },
     deep: true
     }
     }, */
    components: {viewTackOutDetail, xlinkModal}
  }
</script>

<style scoped>
  .expand-row {
    margin-bottom: 16px;
  }
</style>
